<div ng-controller="goodsTypeCtrl">
    <div class="bg-white lter b-b wrapper-md ng-scope">
        <h4 class="m-n font-thin">商品分类</h4>
    </div>
    <div class="wrapper">
        <div class="panel panel-body">

                <div class="inline w-full m-b-sm">
                    <div class="pull-right pos-rlt">
                        <button class="btn btn-sm btn-info" ng-click="open()">添加分类</button>
                        <div class="type-add-box" ng-show="isOpen">
                            <form name="addForm" class="form-validation">
                                <div class="m-b-sm">
                                    <span class="m-b-sm h5 block font-bold">分类名称</span>
                                    <input type="text" name="name" ng-model="typeAddVO.name" class="form-control h6 w-xxl m-b-xs" required>
                                    <div ng-if="addForm.name.$touched">
                                        <span class="h6 text text-danger" ng-if="addForm.name.$error.required">名称是必需的</span>
                                    </div>
                                </div>
                                <div class="m-b-sm">
                                    <span class="h5 font-bold block m-b-sm">顶级类别</span>
                                    <select class="h6 form-control fa-border" ng-model="typeAddVO.parentId" required>
                                        <div>请选择父级</div>
                                        <option value="root">顶级</option>
                                        <option value="{{item.id}}" ng-repeat="item in goodstypeNames">{{item.fullName}}</option>
                                    </select>
                                </div>
                                <div>
                                    <button type="submit" class="btn btn-sm btn-success" ng-disabled="addForm.$invalid" ng-click="addTypes()">确认</button>
                                    <button class="btn btn-sm btn-default" ng-click="cancel()">取消</button>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
                <div>
                    <div class="m-b-xs">
                        <div class="border-box-top bg-light">
                            <div class="po-border-over">
                                <div class="po-item th1">
                                    <span>分类名称</span>
                                </div>
                                <div class="po-item th1">
                                    <span>排序</span>
                                </div>
                                <div class="po-item th2">
                                    <span>分类图片</span>
                                </div>
                                <div class="po-item th1">
                                    <span>创建时间</span>
                                </div>
                                <div class="po-item th6">
                                    <span>操作</span>
                                </div>
                                <div class="clearfix">
                                </div>
                            </div>
                        </div>
                    </div>
                    <div>
                        <div class="border-box m-b-xs fa-border" ng-repeat="types in goodstypes" ng-init="init(types)">

                            <div class="po-border-main">
                                <!-- 1级 -->
                                <div class="inline w-full">
                                    <div class="po-td th1 h5">
                                        <div class="inline" ng-click="types.visiable=!types.visiable">
                                            <i class="fa text-muted expand-border" ng-class="{false:'fa-plus',true:'fa-minus'}[types.visiable]" ng-if="types.children.length>0"></i>
                                            <span>{{types.name}}</span>
                                        </div>
                                    </div>
                                    <div class="po-td th1 h5">
                                        <span>{{types.sort}}</span>
                                    </div>
                                    <div class="po-td th2">
                                        <div class="inline h6 info-cusor" ng-click="showPicBox(types)" ng-if="types.imgUrl==''||types.imgUrl==null">
                                            <i class="text-muted fa fa-plus"></i>
                                            <span>添加图片</span>
                                        </div>
                                        <div class="inline h6 info-cusor" ng-click="showPicBox(types)" ng-if="!(types.imgUrl==''|| types.imgUrl==null)">
                                            <i class="text-muted fa fa-eye"></i>
                                            <span>查看图片</span>
                                        </div>
                                    </div>
                                    <div class="po-td th1 h5">
                                        <span class="h6">{{types.createdTime}}</span>
                                    </div>
                                    <div class="po-td th6 h6" >
                                        <div class="inline m-b-xs">
                                            <div class="pos-rlt inline">
                                                <a class="text text-info" ng-click="editShow(types)">修改</a>
                                                <div class="edit-box" ng-if="types.editVisiable">
                                                    <form name="editForm" class="form-validation" ng-submit="editTypes(types)">
                                                        <div class="m-b-sm">
                                                            <span class="m-b-sm h5 block font-bold">分类名称</span>
                                                            <input type="text" name="name" ng-model="typeEditVO.name" class="form-control h6 w-xxl m-b-xs" required>
                                                            <div ng-if="addForm.name.$touched">
                                                                <span class="h6 text text-danger" ng-if="editForm.name.$error.required">名称是必需的</span>
                                                            </div>
                                                        </div>
                                                        <div>
                                                            <button type="submit" class="btn btn-sm btn-success" ng-disabled="editForm.$invalid">确认</button>
                                                            <button class="btn btn-sm btn-default" ng-click="cancelEdit(types,$event)">取消</button>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                            <span class="text-muted">|</span>
                                            <a class="text text-info h6" ng-click="deleteType(types.id,types.name)">删除</a>
                                            <span class="text-muted h6">|</span>
                                            <a class="text text-info h6" ng-click="addChildType(types.id)">添加子分类</a>
                                        </div>
                                    </div>
                                    <div class="clearfix">
                                    </div>
                                </div>

                                <div ng-if="types.visiable">
                                    <!-- 2级 -->
                                    <div class="po-border-main m-t m-b-sm" ng-repeat="type in types.children" ng-init="init(type);">
                                        <div class="inline w-full" >
                                            <div class="po-td th1 h5" >
                                                <div class="inline m-l" ng-click="type.visiable=!type.visiable;">
                                                    <i class="fa text-muted expand-border"  ng-class="{true:'fa-minus',false:'fa-plus'}[type.visiable]" ng-if="type.children.length>0"></i>
                                                    <span>{{type.name}}</span>
                                                </div>
                                            </div>
                                            <div class="po-td th1 h5">
                                                <span>{{type.sort}}</span>
                                            </div>
                                            <div class="po-td th2">
                                                <div class="inline h6 info-cusor" ng-click="showPicBox(type)" ng-if="type.imgUrl==''|| type.imgUrl==null">
                                                    <i class="text-muted fa fa-plus"></i>
                                                    <span>添加图片</span>
                                                </div>
                                                <div class="inline h6 info-cusor" ng-click="showPicBox(type)" ng-if="!(type.imgUrl==''|| type.imgUrl==null)">
                                                    <i class="text-muted fa fa-eye"></i>
                                                    <span>查看图片</span>
                                                </div>
                                            </div>
                                            <div class="po-td th1 h5">
                                                <span class="h6">{{type.createdTime}}</span>
                                            </div>
                                            <div class="po-td th6 h6">
                                                <div class="pos-rlt inline">
                                                    <a class="text text-info"  ng-click="editShow(type)">修改</a>
                                                    <div class="edit-box" ng-if="type.editVisiable">
                                                        <form name="editForm" class="form-validation" ng-submit="editTypes(type)">
                                                            <div class="m-b-sm">
                                                                <span class="m-b-sm h5 block font-bold">分类名称</span>
                                                                <input type="text" name="name"  ng-model="typeEditVO.name" class="form-control h6 w-xxl m-b-xs" required>
                                                                <div ng-if="addForm.name.$touched">
                                                                    <span class="h6 text text-danger" ng-if="editForm.name.$error.required">名称是必需的</span>
                                                                </div>
                                                            </div>
                                                            <div>
                                                                <button type="submit" class="btn btn-sm btn-success" ng-disabled="editForm.$invalid">确认</button>
                                                                <button class="btn btn-sm btn-default" ng-click="cancelEdit(type)">取消</button>
                                                            </div>
                                                        </form>
                                                    </div>
                                                </div>
                                                <span class="text-muted">|</span>
                                                <a class="text text-info h6" ng-click="deleteType(type.id,type.name)">删除</a>
                                                <span class="text-muted">|</span>
                                                <a class="text text-info h6" ng-click="addChildType(type.id)">添加子分类</a>
                                            </div>
                                            <div class="clearfix">
                                            </div>
                                        </div>
                                        <!--3级-->
                                        <div class="po-border-main m-t m-b-sm" ng-if="type.visiable" ng-repeat="lasttype in type.children" ng-init="init(lasttype)">
                                            <div class="inline w-full">
                                                <div class="po-td th1 h5 ">
                                                    <div class="inline m-l-lg">
                                                        <i class="fa text-muted"></i>
                                                        <span>{{lasttype.name}}</span>
                                                    </div>
                                                </div>
                                                <div class="po-td th1 h5">
                                                    <span>{{lasttype.sort}}</span>
                                                </div>
                                                <div class="po-td th2 pos-rlt">
                                                    <div class="inline h6 info-cusor" ng-click="showPicBox(lasttype)" ng-if="lasttype.imgUrl==''|| lasttype.imgUrl==null">
                                                        <i class="text-muted fa fa-plus"></i>
                                                        <span>添加图片</span>
                                                    </div>
                                                    <div class="inline h6 info-cusor" ng-click="showPicBox(lasttype)" ng-if="!(lasttype.imgUrl==''|| lasttype.imgUrl==null)">
                                                        <i class="text-muted fa fa-eye"></i>
                                                        <span>查看图片</span>
                                                    </div>
                                                </div>
                                                <div class="po-td th1 h5">
                                                    <span class="h6">{{lasttype.createdTime}}</span>
                                                </div>
                                                <div class="po-td th6 h6">
                                                    <div class="pos-rlt inline">
                                                        <a class="text text-info" ng-click="editShow(lasttype)">修改</a>
                                                        <div class="edit-box" ng-if="lasttype.editVisiable">
                                                            <form name="editForm" class="form-validation" ng-submit="editTypes(lasttype)">
                                                                <div class="m-b-sm">
                                                                    <span class="m-b-sm h5 block font-bold">分类名称</span>
                                                                    <input type="text" name="name" ng-model="typeEditVO.name" class="form-control h6 w-xxl m-b-xs" required>
                                                                    <div ng-if="addForm.name.$touched">
                                                                        <span class="h6 text text-danger" ng-if="editForm.name.$error.required">名称是必需的</span>
                                                                    </div>
                                                                </div>
                                                                <div>
                                                                    <button type="submit" class="btn btn-sm btn-success" ng-disabled="editForm.$invalid">确认</button>
                                                                    <button class="btn btn-sm btn-default" ng-click="cancelEdit(lasttype)">取消</button>
                                                                </div>
                                                            </form>
                                                        </div>
                                                    </div>
                                                    <span class="text-muted">|</span>
                                                    <a class="text text-info h6" ng-click="deleteType(lasttype.id,lasttype.name)">删除</a>
                                                </div>
                                                <div class="clearfix">
                                                </div>
                                            </div>
                                        </div>
                                    </div>

                                </div>

                            </div>
                        </div>
                    </div>
                    <div ng-if="goodstypes.length<=0 && !app.loading" class="padder-v text-center">
                        <span class="h6">~未搜索到任何数据~</span>
                    </div>
                    <div>
                        <circle-loading ng-if="app.loading"></circle-loading>
                    </div>
                    <div class="up-container" ng-show="uploadState">
                        <div class="up-item">
                            <div class="up-item-cancel fa fa-close" ng-click="cancelUploadPic()"></div>
                            <div class="up-item-header font-bold">图片上传</div>
                            <div class="up-item-con">
                                <div class="up-item-con-left">
                                    <span class="block">上传图片</span>
                                </div>
                                <div class="up-item-con-right">
                                    <div class="up-item-con-right-con">
                                        <uploadpic queue-limit="{{limit}}" path="{{path}}"  images="imgUrls" app="app" queue="imgUrlsQueue" info="item" del-func="delImg"></uploadpic>
                                    </div>
                                    <div>
                                        <button class="btn btn-success" ng-click="saveImg()">确认</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
        </div>
    </div>
</div>